import React, { Component } from 'react-native';

import {bindActionCreators} from 'redux';
import * as mainScreenActions from '../../actions/mainScreenActions';
import { connect } from 'react-redux';

const {
  StyleSheet,
  View,
  Text,
  ScrollView
} = React;

class setshow extends Component {
  render() {
  	var {Addr,Stage,Day,HasEat,EatDelay,Sons,Mday,XlPer} = this.props.date;
    return (
    	<ScrollView
    	  contentContainerStyle={styles.contentContainer}/*所有的子视图都会包括在这里*/
    	  style={styles.scrollView}>
    	  <View style={styles.contain}>
    	  	<View style={styles.title}><Text style={styles.titletext}>BW800主要参数</Text></View>
    	  	<View style={styles.page}>
    	  		<View style={styles.pageleft}>
    	  			<Text style={styles.pagelefttext}>控制器地址</Text>
    	  			<Text style={styles.pagelefttext}>母猪状态</Text>
    	  			<Text style={styles.pagelefttext}>第几日</Text>
    	  			<Text style={styles.pagelefttext}>今日已吃(克)</Text>
    	  			<Text style={styles.pagelefttext}>要求喂食延迟</Text>
    	  			<Text style={styles.pagelefttext}>仔猪头数</Text>
    	  			<Text style={styles.pagelefttext}>保存日</Text>
    	  			<Text style={styles.pagelefttext}>每次下料(克)</Text>
    	  		</View>
    	  		<View style={styles.pageright}>
    	  			<Text style={styles.pagelefttext}>{Addr}{/*控制器地址*/}</Text>
    	  			<Text style={styles.pagelefttext}>{Stage}</Text>
    	  			<Text style={styles.pagelefttext}>{Day}日</Text>
    	  			<Text style={styles.pagelefttext}>{HasEat}克</Text>
    	  			<Text style={styles.pagelefttext}>{EatDelay}秒</Text>
    	  			<Text style={styles.pagelefttext}>{Sons}头</Text>
    	  			<Text style={styles.pagelefttext}>{Mday}日</Text>
    	  			<Text style={styles.pagelefttext}>{XlPer}克</Text>
    	  		</View>
    	  	</View>
    	  </View>
    	</ScrollView>
    );
  }
}

var styles = StyleSheet.create({
	contain:{
		flex:1,
		height:240,
		//backgroundColor:'red',
		marginLeft:25,
		marginRight:25,
		borderRadius:5,
		borderWidth:0.5,
		elevation:10,
	},
	title:{
		flex:1,
		backgroundColor:'#113477',
		justifyContent:'center',
		paddingLeft:20,
		borderTopLeftRadius:5,
		borderTopRightRadius:5,
		borderBottomWidth:0.5
	},
	titletext:{
		fontSize:15,
		color:'white',
	},
	page:{
		flex:7,
		backgroundColor:'white',
		flexDirection:'row'
		//backgroundColor:'grey'
	},
	pageleft:{
		flex:2,
		borderRightWidth:0.5,
		//backgroundColor:'red'
	},
	pagelefttext:{
		fontSize:16,
		marginLeft:10,
		marginTop:2
	},
	pageright:{
		flex:3
	},
	scrollView:{
		backgroundColor:'#EDE9E9'
	},
	contentContainer: {
      paddingVertical: 20,

    }
});

//将全局state绑定到组件的props中
function mapStateToProps(state) {
  return { 
    //state字段key
    date: state.mainScreenRedux.bwset.date,//在上面的组件实例化时存入 
    currentUnit:state.mainScreenRedux.bwmain.currentUnit,
    currentAddr:state.mainScreenRedux.bwmain.currentAddr
  }
}
//绑定一个方法到props中
function mapDispatchToProps(dispatch) {
  return { 
    mapactions: bindActionCreators(mainScreenActions, dispatch) 
  }
}
//将全局的state绑定到组件中
export default connect(mapStateToProps,mapDispatchToProps)(setshow);

